<script setup name="SystemInfo">
import { reactive, ref } from "vue";
const systemInfo = reactive({
	hospitalName: "XXXX人民医院",
	hospitalLogo: new URL("../assets/images/hospital.jpg", import.meta.url).href
});

const needPreview = ref(false);
</script>
<template>
	<div class="system-info">
		<div class="system-info-item">
			<img :src="systemInfo.hospitalLogo" width="60" />
		</div>
		<div class="system-info-item hospital-name">
			{{ systemInfo.hospitalName }}
		</div>
	</div>
</template>
<style lang="scss" scoped>
.system-info {
	display: flex;
	flex-direction: row;
	align-items: center;
	background-color: lightblue;
	height: 100%;
}

.system-info-item {
	color: #fff;
}

.hospital-name {
	font-size: 20px;
	// margin-top: 20px;
}
</style>
